<template>

  <view class="yester">
    <!-- <uni-nav-bar  title="昨日积分" dark  :fixed="true" left-icon="left" :left-text="true"  /> -->
    <intake-nav-bar title="昨日积分" :fixed="true" color="#fff" />
    <view v-if="dataList.length < 1" class="ac mt200 empty-style">
      <view class="fs28 name-color">暂无积分内容</view>
    </view>
    <scroll-view class="list" scroll-y @scrolltolower="dataList" v-else>
      <view class="yester-center">
        <view class="yester-item " :key="key" v-for="(item, key) in dataList">
          <view class="area">
            <view class="yester-code">
              <view class="code">{{ item.code }}</view>
              <view class="title">{{ item.title }}</view>
            </view>
            <view class="yester-number">
              <view class="yester-all">
                <view class="num-title">昨日积分</view>
                <view class="num_score">{{ $common.parseFloatFixed(item.score_sum) }}</view>
              </view>
              <view class="yester-all">
                <view>
                  <view class="num-title">总积分</view>
                  <view class="num_score">{{ $common.parseFloatFixed(item.score_count) }}</view>
                </view>
              </view>
            </view>
          </view>
        </view>
      </view>
      <view v-if="loading" class="loading">加载中...</view>
      <view v-if="noMore" class="no-more">没有更多数据了</view>
    </scroll-view>
  </view>
</template>

<script>
import { userScoreStatistics, getApparatusScoreLists } from '@/api/user/userScore'
export default {
  components: {
  },
  data() {
    return {
      img: "",
      dataList: [],
      page: 1, // 当前页码
      pageSize: 10, // 每页数据量
      loading: false, // 是否正在加载
      noMore: false, // 是否没有更多数据
      loadingType: '', //加载更多status
    }
  },

  async onLoad(query) {
    this.apparatusScoreLists()
  },
  methods: {

    sumFixed(num) {
      return parseFloat(num).toFixed(2);
    },
    async apparatusScoreLists() {
      if (this.loading || this.noMore) return;
      this.loading = true;
      const newData = await getApparatusScoreLists({
        page: this.page,
        pageSize: this.pageSize,
      })
      if (newData.data.length > 0) {
        this.dataList = this.dataList.concat(newData.data);
        this.page++;
      } else {
        this.noMore = true;
      }

      this.loading = false;
    }
  }
}
</script>

<style lang="scss" scoped>
.yester {
  background: url($baseBgImage) no-repeat center / 100% 100%;
  width: 100%;
  height: 100vh;
  /* 使用视口高度，确保元素高度充满整个屏幕 */
  justify-content: center;
  background-size: cover;

  /* 使背景图片覆盖整个元素 */
  .yester-center {
    padding: 30rpx 30rpx;

    .yester-item {
      background-color: #ffffff;
      border-radius: 15rpx;
      margin: 30rpx 0rpx;
      height: 175rpx;
      padding: 30rpx;

      .area {
        display: flex;

        .yester-code {
          width: 100%;
          //position: relative;
          position: relative;

          .code {
            color: #212b3d;
            font-family: MiSans-Semibold;
            font-weight: 600;
            font-size: 28rpx;
            margin-top: 10rpx;
          }

          .title {
            color: #3f4654;
            font-family: 'MiSans-Regular';
            font-weight: 400;
            font-size: 28rpx;
            padding: 15rpx 0;
          }
        }

        .yester-number {
          display: flex;

          .yester-all {
            position: relative;
            width: 175rpx;
            text-align: center;
            justify-content: center;
            align-items: center;
            border-left-style: dashed;
            border-width: 3rpx;
            border-color: #a4a4a4;
            height: 124rpx;

            .title {
              font-weight: 400;
              font-size: 24rpx;
              color: #8f9299;
              font-family: 'MiSans-Regular';
            }

            .num_score {
              font-family: MiSans-Semibold;
              font-weight: 600;
              font-size: 42rpx;
              color: #034efd;
              margin-top: 10rpx;
            }
          }

          .num-title {
            margin-top: 10rpx;
          }
        }
      }
    }
  }
}
</style>
<style>
.loading,
.load-more,
.no-more {
  text-align: center;
  padding: 20px;
  font-size: 14px;
  color: #666;
}
</style>